<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>选择商品</title>
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-slide.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="../script/vant/index.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/common.css" />
    <link rel="stylesheet" type="text/css" href="css/editstyle.css" />
    <link rel="stylesheet" type="text/css" href="css/public.css" />
    <link rel="stylesheet" type="text/css" href="css/activity.css" />
    <style>
        .left_pro {
            width: 20%;
            height: 700px;
            background: #f3f3f3;
        }

        .right_pro {
            width: 78%;
            height: 700px;
            background: #fff;
            overflow: hidden;
        }

        .van-sidebar-item {
            background-color: #f3f3f3;
        }

        .van-sidebar-item--select,
        .van-sidebar-item--select:active {
            background-color: #ffffff;
            font-weight: 600;
        }

        .van-sidebar-item--select::before {
            background-color: #fff;
        }

        .van-sidebar-item--select .van-sidebar-item {

            font-weight: 400;
        }

        

        .van-sidebar-item--select-list,
        .van-sidebar-item--select-list:active {
            color: #1a66ff !important;
            background-color: #f3f7ff !important;
        }
     .van-sidebar-item.van-sidebar-item--select-list::before {
            background-color: #e6ae15;
        }

         .van-sidebar-item.van-sidebar-item--select-list {
            font-weight: 600;
        }

        .choosebox {
            width: 100%;
            height: 50%;
            position: absolute;
            bottom: 0px;
            background: #fff;
            padding-top: 10px;
            border-radius: 5px;
            box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 20%);
            z-index: 99999;
            overflow: hidden;
        }
        .centerbox{
            width: 90%;
            left: 5%;
            min-height: 300px;
            max-height: 530px;
            position: absolute;
            top:10%;
            background: #fff;
            padding-top: 10px;
            border-radius: 10px;
            box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 20%);
            z-index: 99999;

        }
    </style>
</head>

<body>
    <!-- v-cloak -->
    <div id="app" v-cloak>
        <div v-if="show||show_pro" class="maskbg" v-on:click="closebox()">
        </div>
        <!-- 由下向上弹出选中商品 -->
        <div v-if="show==true" class="choosebox">
            <div class="pro_choose font7 color9 bor_bottom">已选择 {{choosenum}} 种商品
                <i class="icon iconfont icon-shanchu- fr" style="color: #bbb;"></i>
            </div>
            <div class="order_product" style="height: 90%; overflow-y:auto;">
                <ul class="aui-list aui-media-list" style="background-size:100% 0px; border: none;">
                    <li class="aui-list-item" style="border: none; background-size:100% 0px; position: relative;" v-for="item in choose_prolist">
                        <div class="aui-media-list-item-inner btn_line">
                            <div class="aui-list-item-media">
                                <img :src="item.CoverImage">
                            </div>
                            <div class="aui-list-item-inner">
                                <div class="pro-list-item-title aui-ellipsis-2">
                                    {{item.Name}}
                                </div>
                                <div class="pro_type">
                                    <div class="pro_type_item fl aui-ellipsis-1">型号名称：{{item.TypeTitle}}</div>
                                    <div v-if="item.LimitCount!=undefined" class="pro_type_itemrgt  fr aui-ellipsis-1">限购数量：{{item.LimitCount}}</div>
                                    <div v-if="ProductType=='activity'" class="pro_type_item fl aui-ellipsis-1" style="width: 75%; margin-top: 4px;">
                                        <div v-if="zhekou">销售单价：￥{{item.SalePrice}}</div>
                                        <div v-if="!zhekou">
                                            <s>￥{{item.SalePrice}}</s>
                                        活动价:<span>￥{{item.ActivityPrice}}</span>
                                        </div>
                                        
                                        
                                    </div>
                                    <div v-if="ProductType=='member'" class="pro_type_item fl aui-ellipsis-1" style="width: 75%; margin-top: 4px;">
                                        <s>￥{{item.SalePrice}}</s>
                                        会员价:<span>￥{{item.MemberPrice}}</span>
                                    </div>
                                    <div class="pro_type_itemrgt icon fr aui-ellipsis-1">
                                        <!-- <i v-on:click="do_edit(item)" class="icon iconfont icon-bianji fr"
                                            style="font-size: 17px;"></i> -->
                                        <i v-on:click="do_remove(item.ID)" class="icon iconfont icon-shanchu1 fr"
                                            style="font-size: 18px;"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 点击加号弹窗添加商品 -->
        <div  v-if="show_pro" class="centerbox">
            <div class="small_wintitle font8 font-weight" style="font-size: 1rem;">活动商品信息录入</div>
            <div class="sm_winbox">
                <div class="dcwj_con2">
                    <div class="dcwj_list ">
                        <div class="fmly_lft color9 fl font7" style="width: 28%;">商品名称</div>
                        <div class="dcwj_left fr">
                            <label class="noedit font7">{{cen_winobj.Name}}</label>
                            <!-- <span>{{cen_winobj.producttitle}}</span> -->
                        </div>
                    </div>
                    <div class="dcwj_list ">
                        <div class="fmly_lft color9 fl font7" style="width: 28%;">销售价</div>
                        <div class="dcwj_left fr">
                            <label class="noedit">￥{{cen_winobj.SalePrice}}</label>
                        </div>
                    </div>
                    <div v-if="ProductType=='activity'">
                    <div v-if="!zhekou" class="dcwj_list ">
                        <div class="fmly_lft color9 fl font7" style="width: 30%;">活动单价<i
                                class="icon iconfont icon-bitianxiang- redcolor bitian"></i></div>
                        <div class="dcwj_left fr">
                            <input type="number" placeholder="0" class="fr" v-model="cen_winobj.ActivityPrice" style=" width: 50%; padding-right: 10px; border:solid 0.5px #ddd">
                        </div>
                    </div>
                    <div class="dcwj_list">
                        <div class="fmly_lft color9 fl font7" style="width: 28%;">限购数量</div>
                        <div class="dcwj_left fr">
                            <input type="number" placeholder="0" class="fr" v-model="cen_winobj.LimitCount" style=" width: 50%; padding-right: 10px; border:solid 0.5px #ddd">
                        </div>
                    </div>
                </div>
                <div v-if="ProductType=='member'">
                    <div class="dcwj_list ">
                        <div class="fmly_lft color9 fl font7" style="width: 30%;">会员价<i
                                class="icon iconfont icon-bitianxiang- redcolor bitian"></i></div>
                        <div class="dcwj_left fr">
                            <input type="number" placeholder="0" class="fr" v-model="cen_winobj.MemberPrice" style=" width: 50%; padding-right: 10px; border:solid 0.5px #ddd">
                        </div>
                    </div>
                    </div>


                </div>

            </div>
            <div class="win_pagebtn">
                <div class="linebuttom sortwidth fl" v-on:click="closebox()">取消</div>
                <div class="buttom sortwidth fr" v-on:click="save_editpro(cen_winobj.ID)">保存</div>
            </div>
        </div>
        <section>
            <div class="left_pro fl">
                <div class="pd70 van-sidebar">
                    <div  v-for="item in sortList">
                        <div class="van-sidebar-item" v-on:click="select_pro(item)" :class="{'van-sidebar-item--select':selectid==item.ID,'bluecolor':selectid==item.ID}">
                            <div class="van-sidebar-item__text">{{item.Name}}</div>
                        </div>
                        <div v-if="item.children!=undefined&&item.children.length>0" style=" border-top: solid 0.5px #eee;">
                            <div v-if="openid==item.ID" class="van-sidebar-item " v-on:click="select_prolist(item2)"
                                :class="{'van-sidebar-item--select-list':selectitemid==item2.ID}"
                                v-for="item2 in item.children" style="background: #fff;">
                                <div class="van-sidebar-item__text font65">{{item2.Name}}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="right_pro fr">
                <div class="orderlist pd70" style=" height: 100%; overflow-y: auto;">
                    <div class="order_list_item">
                        <div class="order_product">
                            <ul class="aui-list aui-media-list" style="background-size:100% 0px; border: none;">
                                <li class="aui-list-item"
                                    style="border: none; background-size:100% 0px; position: relative;"
                                    v-for="item in productList">
                                    <div class="aui-media-list-item-inner btn_line">
                                        <div class="aui-list-item-media">
                                            <img :src="item.CoverImage">
                                        </div>
                                        <div class="aui-list-item-inner">
                                            <div class="pro-list-item-title aui-ellipsis-2"
                                                v-on:click="do_opendetail(item.ID)">
                                                {{item.Name}}
                                            </div>
                                            <div class="pro_type">
                                                <div class="pro_type_item fl aui-ellipsis-1" style="width: 100%;">
                                                    型号名称：{{item.TypeTitle}}</div>
                                            </div>
                                            <div class="only_price_box">
                                                <label><span class="color9">销售单价：</span>￥{{item.SalePrice}}</label>
                                                <label class="fr" v-if="ProductType!='activity'&&ProductType!='member'">
                                                    <i v-if="!item.isSelect" v-on:click="do_editproduct(item)"
                                                    class="icon iconfont icon-tianjia1 fr bluecolor font-weight"
                                                    style="font-size: 18px;"></i>
                                                <i v-if="item.isSelect" v-on:click="do_remove(item.ID)"
                                                class="icon iconfont icon-jianshao fr redcolor font-weight"
                                                style="font-size: 18px;"></i>
                                                </label>
                                                <label class="fr" v-if="ProductType=='activity'">
                                                    <i v-if="!item.IsSaleActivityPrice&&!item.isSelect" v-on:click="do_editproduct(item)"
                                                    class="icon iconfont icon-tianjia1 fr bluecolor font-weight"
                                                    style="font-size: 18px;"></i>
                                                <i v-if="!item.IsSaleActivityPrice&&item.isSelect" v-on:click="do_remove(item.ID)"
                                                class="icon iconfont icon-jianshao fr redcolor font-weight"
                                                style="font-size: 18px;"></i>
                                                <span v-if="item.IsSaleActivityPrice" class=" font6 fr color9" style="padding-top: 5px;">已加入</span>
                                                </label>
                                                <label class="fr" v-if="ProductType=='member'">
                                                    <i v-if="!item.IsMemberPrice&&!item.isSelect" v-on:click="do_editproduct(item)"
                                                    class="icon iconfont icon-tianjia1 fr bluecolor font-weight"
                                                    style="font-size: 18px;"></i>
                                                <i v-if="!item.IsMemberPrice&&item.isSelect" v-on:click="do_remove(item.ID)"
                                                class="icon iconfont icon-jianshao fr redcolor font-weight"
                                                style="font-size: 18px;"></i>
                                                <span v-if="item.IsMemberPrice" class=" font6 fr color9" style="padding-top: 5px;">已加入</span>
                                                </label>
                                            </div>



                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>

                    </div>
                    <div class="noway">-- 已经到底了 --</div>
                </div>
            </div>

        </section>
        <div class="pagebtn">
            <div class="btn_save fl" v-on:click="do_choose_productlist()">
                <span v-if="choosenum" class="yuan">{{choosenum}}</span>
                <i class="icon iconfont icon-gouwulan bluecolor"></i>
            </div>
            <div class="buttom minddlewidth fr" v-on:click="do_addproduct()">保存</div>
        </div>
    </div>
</body>
<script type="text/javascript " src="../script/api.js "></script>
<script type="text/javascript " src="../script/vant/vue.js"></script>
<script type="text/javascript " src="../script/vant/vant.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/aui-actionsheet.js"></script>
<script type="text/javascript" src="../script/aui-slide.js"></script>
<script type="text/javascript" src="../script/aui-pull-refresh.js"></script>
<script type="text/javascript" src="../script/mui/mui.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.picker.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.poppicker.js"></script>
<script type="text/javascript" src="../script/aui-scroll.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript " src="js/choose_product.js"></script>



</html>